<template>
  <view class="duty-record">
    <view v-if="list.length > 0">
      <DutyRecordItem class="meetign-item" v-for="(item, index) in list" :key="index" :data="item" :type="tab" />
    </view>
    <Empty v-else />
  </view>
</template>

<script>
import DutyRecordItem from './components/DutyRecordItem.vue'
import { list } from '@/api/duty-basic/duty-record.js'
import Empty from '@/components/cu-empty/index.vue'
export default {
  name: '',
  data() {
    return {
      queryParams: {
        pageNum: 1,
        pageSize: 10
      },
      tab: 2,
      list: [],
      total: 0
    }
  },
  components: {
    DutyRecordItem,
    Empty
  },
  methods: {
    async getList(isRefresh = true) {
      const { rows = [], total } = await list(this.queryParams).finally(() => uni.stopPullDownRefresh())
      if (isRefresh) {
        this.list = rows
      } else {
        this.list = [...this.list, ...rows]
      }
      this.total = total
    },
    onTabsChange() {
      this.reset()
    },
    reset() {
      this.total = 0
      this.queryParams.pageNum = 1
      this.getList()
      this.list = []
    }
  },
  onShow() {
    this.reset()
  },
  onNavigationBarButtonTap() {
    uni.navigateTo({
      url: '/pages/work/duty-record/add'
    })
  },
  onPullDownRefresh() {
    this.reset()
  },
  onReachBottom() {
    const { pageNum, pageSize } = this.queryParams
    if (pageNum * pageSize < this.total) {
      this.queryParams.pageNum += 1
      this.getList(false)
    }
  }
}
</script>

<style lang="scss" scoped>
.duty-record {
  padding-top: 20rpx;
}

.meetign-item {
  margin-bottom: 30rpx;
}
</style>
